<template>  
  <li>  
    {{ todo.text }}  
    <button @click="deleteTodo">Delete</button>  
  </li>  
</template>  
  
<script>  
export default {  
  props: ['todo'],  
  methods: {  
    deleteTodo() {  
      this.$emit('delete', this.todo.id);  
    }  
  }  
};  
</script>